<!--
 * @Descripttion:
 * @version: 1.0.1
 * @Author: daipeng
 * @Date: 2020-08-20 17:18:52
 * @LastEditors: daipeng
 * @LastEditTime: 2020-10-27 19:07:09
-->
<template>
    <div>
        <div id="mychart5" style="height: 220px; width: 100%;top: -14px;"></div>
    </div>
</template>

<script>
var common = require("../../../../static/tool.js");
import { mainfun } from "../../../../../assets/js/main.js";
export default {
    props: {},
    data() {
        return {
            url: common.url,
        };
    },
    props: ["dayOneNext"],
    watch: {
        dayOneNext(newName, oldName) {
            this.dayOneNext = newName;
            this.getdata();
        },
    },
    created() {
        //数据请求
        this.getdata();
    },
    methods: {
        getdata() {
            // 先重置数据
            this.str1 = [];
            this.str2 = [];
            let fn = new FormData();
            fn.append("day", this.dayOneNext); //近n天的数据
            this.$http
                .post(this.url + "/index/expressListShopTaskHour", fn)
                .then(
                    (res) => {
                        if (
                            res.data.msg == "查询成功！" ||
                            res.data.code == "200"
                        ) {
                            var ybp = res.data.data;
                            Ybp.forEach((element) => {
                                this.str1.push(element.date);
                                this.str2.push(
                                    mainfun.filterNumber(
                                        element.hour_actual_finish
                                    )
                                );
                            });
                            this.init(); //初始化
                        } else {
                            this.$message.error(res.data.msg);
                            return;
                        }
                    },
                    (res) => {
                        this.$message.error("网络错误！");
                        return;
                    }
                );
        },
        init() {
            this.mychart5 = this.$echarts.init(
                document.getElementById("mychart5")
            );

            var that = this;

            this.mychart5.setOption({
                tooltip: {
                    formatter: "{a} <br/>{b} : {c}%",
                },
                toolbox: {
                    // feature: {
                    //     restore: {},
                    //     saveAsImage: {}
                    // }
                },
                series: [
                    {
                        name: "信用度",
                        type: "gauge",
                        detail: { formatter: " " },
                        data: [{ value: 50, name: "" }],
                    },
                ],
            });
        },
    },
};
</script>

<style scoped>
</style>



// WEBPACK FOOTER //
// src/components/components/echarts/Ybp.vue